<!DOCTYPE html>
<html>
{include file="public/header" /}
<style>
    img{
        width: 80%;
    }
</style>
<body>
<div class="layui-fluid" id="app">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12" style="margin-bottom: 80px">
            <ul class="layui-timeline">
                <li class="layui-timeline-item" v-for="(item,index) in items">
                    <i class="layui-icon layui-timeline-axis">&#xe63f;</i>
                    <div class="layui-timeline-content layui-text">
                        <h3 class="layui-timeline-title">{{item.log_time|setDate}}</h3>
                        <div class="layui-row layui-col-space15">
                            <div class="layui-col-md12" style="color: #0a0903">施工内容</div>
                            <div class="layui-col-md12">{{item.log_content}}</div>
                            <div class="layui-col-md12" style="color: #0a0903">施工人员</div>
                            <div class="layui-col-md12">{{item.worker}}</div>
                            <div class="layui-col-md12" style="color: #0a0903">施工图片</div>
                            <div class="layui-col-md2" v-for="(it,i) in item.pictures">
                                <img :src="it.log_picture"/>
                            </div>
                        </div>
                    </div>
                </li>
            </ul>

        </div>
        <div id="demo7" style="text-align: center;position: fixed;bottom: 0px;background-color: #ffffff;width: 100%"  >
        </div>
    </div>

</div>
</div>
<script>
    var app=new Vue({
        el: "#app",
        data: {
            items:[],
            curr:1,//当前页
            limit:2,//当前页数据个数
        },
        filters:{
            //过滤器
            setDate:function (value) {
                var arr=[];
                arr=value.split("-");
                return arr[1]+'月'+arr[2]+'日'+arr[0]+'年';
            }
        },
    });

    function init() {
        layer.load(2);
        $.get("{:url('stage_log')}" , {page: app.curr, limit: app.limit,id:"{$Request.param.id}"},
            function (res) {
                layer.closeAll();
                app.items = res.data;
                console.log(app.items);
            }
        );
    }
    layui.use(['laypage','layer'], function () {
        var laypage = layui.laypage;
        var layer = layui.layer;
        laypage.render({
            elem: 'demo7'
            ,count: "{$count}" //数据总数
            ,curr:1
            ,limit:2
            , layout: ['count', 'prev', 'page', 'next']
            , jump: function (obj) {
                console.log(obj)
                app.curr = obj.curr;
                app.limit = obj.limit;
                init();
            }
        });
    });
</script>
</body>
</html>




